//var ipt = document.querySelector(".top input")
//var btn = document.querySelector(".top button")
//var center = document.querySelector(".center")


		var add = document.querySelector('#add');
        var ipt = document.querySelector('#ipt');

		ipt.addEventListener("focus",function(){
			add.style.width = "80px";
			ipt.style.borderRadius = "17px";
			ipt.style.borderBottomRightRadius = "0";
			ipt.style.borderTopRightRadius = "0";
			function ct(){
				add.innerHTML = "提交";
			}
			setTimeout(ct,500);
		})
		ipt.addEventListener("blur",function(){
			if(this.value !== ""){
				add.style.width = "80px";
				ipt.style.borderRadius = "17px";
				ipt.style.borderBottomRightRadius = "0";
				ipt.style.borderTopRightRadius = "0";
//				function ct(){
					add.innerHTML = "提交";
//				}
//				ct()
//				setInterval(ct,500);

			}else{
				add.innerHTML = "";
				add.style.width = "0";
				ipt.style.borderRadius = "0";
				ipt.style.borderBottomRightRadius = "0";
				ipt.style.borderTopRightRadius = "0";
				
			}
		})
		function cw(){
	        	var	dv = document.querySelector(".bettent");
	        	dv.innerHTML ="&nbsp;&nbsp;请 输 入 内 容 !&nbsp;&nbsp;";
				dv.style.display="block"
				setTimeout(function () {
					dv.style.display="none"
				}, 2000);
	        }
    add.addEventListener('click',function () {
        //获取input的内容
        var ipt = document.querySelector('#ipt');
        // 创建li标签
        var li = document.createElement('li');
        var span = document.createElement('span');

        
        if(ipt.value !== ""){
        	var span_text = document.createTextNode(ipt.value);
	        span.appendChild(span_text);
	        //创建button标签
	        var button = document.createElement('button');
	        var input = document.createElement('input');
//	        input = input.type="checkbox";
	        var button_text = document.createTextNode('x');
	        button.appendChild(button_text);
        	span.contentEditable = "true";
	        input.type="checkbox";
//	        input.firstChild(button_text);
	        button.addEventListener('click',function () {
	            var list = document.querySelector('#list')
	            list.removeChild(this.parentNode)
	        })
	        //把span和button追加到li标签
	        li.appendChild(input);
	        li.appendChild(span);
	        li.appendChild(button);
	        //把li标签追加到ul里面
	        var list = document.querySelector('#list');
	        list.insertBefore(li,list.firstChild);
	            ipt.value= "";
        }else{	        
	        cw();
        }
        
        
    })
timer()
window.setInterval("timer()", 1000);  
	function timer(){  
	var currDate = new Date();  
	document.getElementById("d").innerHTML = currDate.toLocaleString();   
}  	

			var ipt = document.querySelector('#ipt');
			ipt.onkeydown = function(e){
			    if(e.keyCode == 13){
			    	if(ipt.value == ""){
						 cw();
					}else{
					        // 创建li标签
					        var li = document.createElement('li');
					        var span = document.createElement('span'); 
					        	var span_text = document.createTextNode(ipt.value);
						        span.appendChild(span_text);
						        //创建button标签
						        var button = document.createElement('button');
						        var button_text = document.createTextNode('x');
	        					var input = document.createElement('input');
	        					input.type="checkbox";
	        					input.className="ddd"
						        button.appendChild(button_text);
        						span.contentEditable = "true";
						        button.addEventListener('click',function () {
						            var list = document.querySelector('#list')
						            list.removeChild(this.parentNode)
						        })
						        //把span和button追加到li标签
	        					li.appendChild(input);
						        li.appendChild(span);
						        li.appendChild(button);
						        //把li标签追加到ul里面
						        var list = document.querySelector('#list');
						        list.insertBefore(li,list.firstChild);
						        ipt.value= "";
						        
						        
						        	var co = document.querySelectorAll("#list li .ddd");
						        	var li = document.querySelectorAll('#list li');
						        	var two = document.querySelector(".yb")
						        	for(var i = 0;i<co.length;i++){
						        		co[i].aaa = i;
						        		co[i].onclick=function(){
						        			two.appendChild(li[this.aaa])
						        			var yc = document.querySelector(".yb li");
											var yx = document.querySelector(".yb li button");
						        			yx.addEventListener('click',function(){
												yc.style.display = "none";
											})
						        		}
						        	}
						        	
					};
				}
			}

			
			



			var nav = document.querySelectorAll(".bod .l ul li");
			var main = document.querySelectorAll(".xl > div");
				
			for(var i = 0; i < nav.length; i++){
				nav[i].index = i;
				nav[i].addEventListener('click',function(){
					for(var k = 0; k < nav.length; k++){
						nav[k].classList.remove("active");
						main[k].classList.remove("active");
						
					}
					this.classList.add("active");
					main[this.index].classList.add("active");
				})
			}
			

								